<template>
	<view class="wallet">
		<view class="container">
			<view class="title">
				<view class="line">创建你的</view>
				<view class="line">第一个数字钱包</view>

			</view>
		</view>
		<view class="select">
			<view class="item" @click="registerWallet">
				创建钱包
			</view>
			<view class="item outline" @click="importWallet">
				导入钱包
			</view>
		</view>
		<view class="checkbox">
			<label>
				<checkbox value="cb" checked="true" style="transform:scale(0.7);color:#31E8D6 ;" color="#31E8D6" /></label>
			<view class="text">
				我已阅读并同意<view class="url" @click="protocol">《钱包协议》</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			protocol() {
				//TODO url
				uni.navigateTo({
					url: "../webview/webview?url=https://www.chainnews.com/articles/637063053495.htm&title=钱包协议"
				})
			},
			registerWallet() {
				uni.navigateTo({
					url: "register-wallet"
				})
			},
			importWallet() {
				uni.navigateTo({
					url: "import-wallet"
				})
			}
		}
	}
</script>

<style lang="scss">
	view {
		display: flex;
		flex-direction: column;
	}

	page {
		background-image: url(../../static/background/wallet_bg_night.png);
	}

	.wallet {
		height: 100%;
		padding-top: 120px;

		.container {
			padding: 15px;

			.title {
				.line {
					color: #31E8D6;
					font-size: 32px;
					line-height: 120%;
				}
			}
		}

		.select {
			margin-top: 150px;
			padding: 15px;

			.item {
				border: 1px solid #31E8D6;
				font-size: 18px;
				margin-bottom: 15px;
				border-radius: 6px;
				text-align: center;
				padding: 5px;
				text-align: center;
				color: #000000;
				font-weight: bold;
				background-color: #31E8D6;

			}

			.item.outline {
				background-color: transparent;
				color: #31E8D6;

			}
		}

		.checkbox {
			display: inline;
			text-align: center;
			margin-top: 15px;

			label {}

			.text {
				display: inline;

				.url {
					display: inline;
					color: #31E8D6;
				}
			}
		}
	}
</style>
